import React, { PureComponent } from "react";
import { connect } from "dva";
import { Table} from "antd";




@connect(({ repair }) => ({
  sparesList:repair.sparesList,
  loading:repair.loading,
}))
export default class SparesTable extends PureComponent {
  constructor(props) {
    super(props);
    this.state = {
      currentPage: 1,
      pageSize: 10,
    };
  }



  componentDidMount() {
    this.getData()
  }

  getData = () =>{
    const { dispatch,processId } = this.props;
    dispatch({
      type: `repair/fetch_repair_process_spares`,
      payload: {
        processId,
      }
    })
  }

  // 分页事件--------------------------------
  setPageInfo(info = {}) {
    info.hideOnSinglePage = true;
    info.onChange = (page, pageSize) => {
      this.setState(
        {
          currentPage: page,
          pageSize: pageSize
        },
        () => this.getData()
      );
    };
    info.onShowSizeChange = (current, pageSize) => {
      this.setState(
        {
          currentPage: current,
          pageSize: pageSize
        },
        () => this.getData()
      );
    };
    return info;
  }

  render() {

    const { processId,sparesList,loading  } = this.props;


    const columns = [
      {
        title: '序号',
        dataIndex: 'no',
        render: (text, row, index)=> (
          <span>{index+1}</span>
        ),
      },
      {
        title: '备件编号',
        dataIndex: 'attaCode',
      },
      {
        title: '备件名称',
        dataIndex: 'attaName',
      },
      {
        title: '规格型号',
        dataIndex: 'modelNum',
      },
      {
        title: '使用数量',
        dataIndex: 'usedNum',
      }
    ];




    return (
        <Table
          columns={columns}
          dataSource={sparesList && sparesList[processId] && sparesList[processId].list ? sparesList[processId].list : []}
          pagination={this.setPageInfo(sparesList && sparesList[processId] && sparesList[processId].pagination)}
          loading={loading[processId]}
          rowKey={"attaId"}
          size={"small"}
        />
    );
  }
}
